// 定义深色主题的颜色变量
$dark-bg-primary: #161823;
$dark-bg-secondary: #272933;
$dark-text-color: #ffffff;

$light-bg-primary: #f9f9fa;

html.dark {
  /* 修改自定义元素的样式 */
  .sidebar {
    background-color: $dark-bg-primary;
    color: $dark-text-color;
    .active-item {
      background-color: $dark-bg-secondary;
      color: $dark-text-color;
    }
  }
  .header {
    background-color: $dark-bg-primary;
    color: $dark-text-color;
  }
  
  .content-area {
    background-color: $dark-bg-primary;
    color: $dark-text-color;
  }

  .main-selected {
    .top-nav {
      .menu {
        background-color: $dark-bg-primary;
        li { 
          &.active span {
            color: #e8e8ea;
            border-bottom: 2px solid #e8e8ea;
          }
        }
      }
    }

    .content {
      background-color: #272933;
    }
  }
}